<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Insert title here</title>
<script type="text/javascript" src="/resource/js/jquery-3.2.1.js"></script>
<script type="text/javascript" src="/resource/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/resource/css/bootstrap.min.css">
<link rel="stylesheet" href="/resource/kindeditor/themes/default/default.css" />
	<link rel="stylesheet" href="/resource/kindeditor/plugins/code/prettify.css" />
	<script charset="utf-8" src="/resource/kindeditor/kindeditor.js"></script>
	<script charset="utf-8" src="/resource/kindeditor/lang/zh-CN.js"></script>
	<script charset="utf-8" src="/resource/kindeditor/plugins/code/prettify.js"></script>
	<script>
		KindEditor.ready(function(K) {
			window.editor1 = K.create('textarea[name="content1"]', {
				cssPath : '/resource/kindeditor/plugins/code/prettify.css',
				uploadJson : '/resource/kindeditor/jsp/upload_json.jsp',
				fileManagerJson : '/resource/kindeditor/jsp/file_manager_json.jsp',
				allowFileManager : true,
				afterCreate : function() {
					var self = this;
					K.ctrl(document, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
					K.ctrl(self.edit.doc, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
				}
			});
			prettyPrint();
		});
	</script>
</head>
<body>
	<div class="container">
		<div>
		<!-- 图片 -->
			<a href="/"> <img alt="" src="/resource/pic/logo-admin.jpg" height="50" width="100" ></a> 个人中心
			
			<div class="float-right align-items-center" >
			<br>
				<!-- 右侧的个人中心和退出按钮 -->
				<!-- 如果已经登录，则显示个人中心和退出 -->
					<c:if test="${user!=null }">
						你好，<b>${user.nickname }</b>
						<input class="btn btn-primary btn-sm" type="button" onclick="logout()" value="退出">
					</c:if>
					
					
			</div><br>
			<hr>
		</div>
		
		<div class="row " >
			<!-- 左侧导航栏 -->
			<div class="list-group col-md-2" align="center">
			  <a href="#" class="list-group-item list-group-item-action active" data="/my/articles">我的文章</a>
			  <a href="#" class="list-group-item list-group-item-action" data="/my/publish">发布文章</a>
			  <a href="#" class="list-group-item list-group-item-action" >我的收藏</a>
			  <a href="#" class="list-group-item list-group-item-action" data="/my/comment">我的评论</a>
			</div>
			
			<!-- 右侧显示区 -->
			<div class="col-md-10" id="center">
				
			</div>
		</div>
	
	</div>
	
</body>
<script type="text/javascript">
	$(function(){
		//直接在展示区，加载我的文章数据
		$("#center").load("/my/articles");
	
		//在a标签上绑定事件
		$("a").click(function(){
			
			//获取超链接中的url
			var url = $(this).attr("data");
			
			//将原来展示区中的数据清空
			$("#center").html("");
			
			//重新加载新的数据
			$("#center").load(url);
			
			//将所有标签中包含active的类去掉
			$(".active").removeClass("active");
			
			//将当前选择的标签，加上active类
			$(this).addClass("active");
		})
	})
	
	//退出登录
	function logout(){
		location="/user/logout";
	}
</script>
</html>